<template>
  <view>
    <view class="uni-padding-wrap containers_team">
      <uni-segmented-control :current="current" :values="items" :style-type="styleType" :active-color="activeColor"
        @clickItem="onClickItem" :arrays="list" />
    </view>


    <view style="margin-top: 150rpx;">
      <!-- <mix-tree :list="children" :params="treeParams"></mix-tree> -->

      <scroll-view scroll-x style="width: 100%;white-space: nowrap;" v-if="dddddd">
        <TreeChart2 :json="children" :class="{landscape: landscape.length}" :isRegister="isRegister" />
      </scroll-view>

      <scroll-view scroll-x style="width: 100%;white-space: nowrap;">
        <TreeChart :json="children" :class="{landscape: landscape.length}" :isRegister="isRegister" />
      </scroll-view>
    </view>
    <!-- <block v-for="(item, index) in children" :key="index">
      <view v-if="current == index">
        <scroll-view scroll-x style="width: 90%;background-color: skyblue;white-space: nowrap;">
          <view class="content u-f-ajc u-f-column t-a-c" :class="1 ? 'activeClass' : ''">
            <view class="bhid padd" style="background-color: #EEC2A9;">编号：{{item.id}}</view>
            <view style="background-color: #F4F4F4;">
              <view class="padd">姓名：{{item.realname}}</view>
              <view class="padd">级别：{{item.levelname}}</view>
            </view>
            <view style="background-color: #EEC5CB;width: 100%;">
              <view class="u-f-ajc padd">累积业绩</view>
              <view class="u-f yeji">
                <block v-for="(item2, index2) in item.children" :key="index2">
                  <view class="yeji_item" v-if="item2.id != -1">
                    <view>{{item2.realname}}：</view>
                    <view>￥---</view>
                  </view>
                </block>
              </view>
            </view>
          </view>
        </scroll-view>

        <view class="register t-a-c" v-if="item.id != -1" @click="registerItem(item, index)">
          <view class="padd" style="background-color: #EFC1A9;width: 100%;">空点位</view>
          <view class="padd" style="background-color: #f4f4f4;width: 100%;">注册</view>
        </view>
      </view>
    </block> -->
  </view>
</template>

<script>
  import uniSegmentedControl from "../../components/uni-segmented-control/uni-segmented-control.vue"
  import mixTree from "./components/mix-tree/mix-tree.vue"

  import TreeChart from "../../components/vue-tree-charts/TreeChart.vue"
  import TreeChart2 from "../../components/vue-tree-charts/TreeChart2.vue"

  export default {
    components: {
      uniSegmentedControl,
      mixTree,
      TreeChart,
      TreeChart2,
    },
    data() {
      return {
        items: ['第一部门', '第二部门', '第三部门', '第四部门'],
        list: [],
        isRegister: '',
        current: 0,
        styleType: 'button',
        activeColor: '#D01819',
        children: {},
        arrs: [],

        treeParams: {
          defaultIcon: './static/i2.png', // 默认图标
          currentIcon: './static/i1.png', // 展开图标
          lastIcon: './static/i3.png', //最后一级图标
          border: true // 边框， 默认不显示
        },


        landscape: [],
      }
    },
    onLoad() {
      this.getData();
      this.getData2();
    },
    computed: {
      dddddd() {
        console.log('ASsASASFDASDASD', this.children)
        if (this.children.hasOwnProperty('children')) {
          console.log('ASsASASFDASDASD', this.children.children.some(item => item.id != 1 && item.id != -1))
          return this.children.children.some(item => item.id != 1 && item.id != -1)
        }
      }
    },
    methods: {
      async getData() {
        let {
          data: {
            zhitui
          }
        } = await this.$myRequest({
          url: "/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=member.userdata&app=1",
          method: "POST",
          data: {
            openid: uni.getStorageSync('openid')
          },
        })
        // console.log('查看获取到的数据', zhitui)
        this.list = zhitui
        this.isRegister = zhitui[0].id
      },

      async getData2() {
        let res = await this.$myRequest({
          url: "/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=member.userdata.get_tree&app=1",
          method: "POST",
          data: {
            openid: uni.getStorageSync('openid')
          },
        })
        // console.log(res)
        if (res && res.data && res.data.length) {
          this.arrs = res.data
          this.children = this.arrs[0]
          console.log('11111', this.children)
          // this.children = this.arrs.filter((item, index) => index == 0);
        } else {
          this.arrs = []
          this.children = []
          console.log('空')
        }
      },

      onClickItem(e) {
        console.log('出来的值', e)
        if (this.current !== e.index) {
          if (this.arrs.length) {
            this.current = e.index
            this.isRegister = e.id
            this.children = this.arrs[e.index];
            console.log('22222', this.children)
            // this.children = this.arrs.filter((item, index) => index == e);
            console.log('切换查看值', this.children)
          } else {
            this.children = []
            console.log('空的')
          }
        }
      },
    }
  }
</script>

<style lang="less">
  // import '../../components/vue2-org-tree/dist/style.css';
  .uni-padding-wrap {
    width: 100%;
    box-sizing: border-box;
  }

  .uni-common-mt {
    margin: 60rpx 0;
  }

  .containers_team {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background-color: #F3F3F3;
    padding: 30rpx;
  }
</style>
